<template>
  <div class="app-container">
    <el-tabs v-model="activeName" type="card" @tab-remove="removeTab" @tab-click="tabClickclone">
      <el-tab-pane label="计划列表" name="1">
        <template v-if="activeName === '1'">
          <BaseValue @CreatedPlan="CreatedPlan"></BaseValue>
        </template>
      </el-tab-pane>
      <el-tab-pane label="与我相关" name="2">
        <template v-if="activeName === '2'">
          <Related ref="iscond"></Related>
        </template>
      </el-tab-pane>
      <!-- <el-tab-pane label="计划明细" name="5">
        <template v-if="activeName === '5'">
          <Internal></Internal>
        </template>
      </el-tab-pane> -->
      <template v-if="tabIndex">
        <el-tab-pane label="计划详情" name="3" closable>
          <template v-if="activeName === '3'">
            <ChildrenPlan :upkeepPlanId="rowObj"></ChildrenPlan>
          </template>
        </el-tab-pane>
      </template>
      <el-tab-pane label="新增计划" name="4" closable v-if="tabtwo">
        <template v-if="activeName === '4'">
          <CreatedPlan @quit="quit"></CreatedPlan>
        </template>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
export default {
  name: "plan",
  components: {
    BaseValue: () => import('./frontPage/index.vue'),//标准
    Related: () => import('./related/index.vue'),//类型
    ChildrenPlan: () => import('./ChildrenCreated/ChildrenPlan.vue'),//详情
    CreatedPlan: () => import('./ChildrenCreated/CreatedPlan.vue'),//新增
    Internal: () => import('./internal/index.vue'),//明细
    // operationTable: ()=> import('./operation-table/index.vue')
  },
  data () {
    return {
      activeName: '1',
      tabIndex: false,
      rowObj: {},
      tabtwo: false,
    };
  },
  watch: {
    activeName (val) {
      if (val != '2') {
        if (this.$route.query.isCondition) {
          this.$route.query.isCondition = undefined
        }
      }

    }
  },
  computed: {
    isCondition: {
      get () {
        return this.$store.state.user.isCondition
      }
    },
  },
  mounted () {
    this.activeName = this.isCondition
    if (this.isCondition === '2') {
      setTimeout(() => {
        this.$refs['iscond'].$refs['reftable'].getList({ auditStatus: '1' });
      }, 500);
    }
  },
  methods: {
    tabClickclone () {
      if (this.activeName === '1' || this.activeName === '2' || this.activeName === '5') {
        this.tabIndex = false
        this.tabtwo = false
        this.rowObj = {}
      }
    },
    removeTab () {
      this.tabIndex = false
      this.tabtwo = false
      this.activeName = '1'
    },
    /**新增保养计划 */
    CreatedPlan () {
      this.tabtwo = true
      this.activeName = '4'
    },
    quit () {
      this.tabtwo = false
      this.activeName = '1'
    }
    // addTab(row){
    //   this.tabIndex = true
    //   this.activeName = '3'
    //   this.rowObj = row
    // }
  }
};
</script>
